<template>
	<view class="detail-container">
		<view class="detail-title">{{noticeDetail['标题']}}</view>
		<view class="detail-content">
		{{noticeDetail['内容']}}
		</view>
		<file-list :file="noticeFile"></file-list>
		<!-- <view class="detail-img">
			<image src="../../static/icon/4.png"></image>
		</view> -->
		<view class="bottom-box">
			<text>{{noticeDetail['作者']}}</text>
			<text>{{noticeDetail['创建时间'] | formatTime}}</text>
		</view>
		<!-- <view class="detail-time">{{noticeDetail['创建时间'] | formatTime}}</view> -->
	</view>
</template>

<script>
	import FileList from '../components/fileList.vue' 
	export default {
		components: {
			FileList
		},
		data() {
			return {
				params: {
					通知id: null
				},
				noticeDetail: {},
				noticeFile: {},
				imglength: 0,
				imgItem: []
			}
		},
		onLoad(options) {
			this.params.通知id = +options.id
			this.getNoticeDetail()
		},
		methods: {
			getNoticeDetail() {
				uni.showLoading()
				this.$http.post('gridSystem/message/info', this.params).then(res => {
					if(res.code === 10000) {
						this.noticeDetail = res.data
						if(res.data.附件.length) {
							res.data.附件.forEach((item, index) => {
								this.downloadFile(item, index)
							})
						}
					}
				})
			},
			downloadFile(id, index) {
				this.imgLength++
				this.$http.post('common/file/download', {
					id
				}).then(res => {
					console.log(res)
					if (res.code === 10000) {
						this.imgItem.push(res.data.fileData)
						this.noticeFile[index] = {}
						this.noticeFile[index].fileData = res.data.fileData
					}
				})
			}
		}
	}
</script>

<style lang="scss">
.detail-container {
	padding: 36rpx 48rpx 48rpx 46rpx;
		.detail-title {
			color: #333;
			font-size: 36rpx;
			margin-bottom: 23rpx;
			text-align: center;
			font-weight: bold;
			// margin-left: 240rpx;
		}
		.detail-content {
			font-size: 32rpx;
			color: #333;
			margin-bottom: 50rpx;
			text-align: justify;
		}
		.bottom-box {
			margin-top: 40rpx;
			color: #333;
			display: flex;
			font-size: 32rpx;
			justify-content: space-between;
		}
	}
</style>
